<template>
  <div class="new-company">
    <div class="table-wrapper">
      <div class="table-title">{{ $route.query.type || "企业列表" }}</div>
      <a-table
        :columns="columns"
        :data-source="list"
        :pagination="pagination"
        rowKey="index"
        :loading="loading"
        :customRow="
          (record, index) => {
            return {
              on: {
                click: () => {
                  this.$router.push('/company/' + record.ID);
                }
              }
            };
          }
        "
      >
        <div slot="index" slot-scope="text, record, index">{{ index + 1 }}</div>
        <div slot="time" slot-scope="text, record">
          {{ record.CreatedAt | date }}
        </div>
        <div slot="name" slot-scope="text, record">
          {{ record.name || record.cName }}
        </div>
      </a-table>
    </div>
  </div>
</template>

<script>
import { getStoreList } from "@/api/account";

const columns = [
  {
    title: "序号",
    dataIndex: "index",
    scopedSlots: { customRender: "index" }
  },
  // {
  //   title: "企业类型",
  //   dataIndex: "type",
  //   scopedSlots: { customRender: "type" }
  // },
  {
    title: "单位名称",
    dataIndex: "name",
    scopedSlots: { customRender: "name" }
  },
  {
    title: "地区",
    dataIndex: "cArea",
    scopedSlots: { customRender: "cArea" }
  },
  {
    title: "发布时间",
    dataIndex: "time",
    scopedSlots: { customRender: "time" }
  }
];

export default {
  data() {
    return {
      columns,
      list: [],
      pagination: {
        total: 0,
        showTotal: total => `共${total}条`,
        pageSize: 20,
        onChange: page => {
          this.query.page = page;
          this.getStoreList();
        }
      },
      loading: false,
      query: {
        page: 1,
        pageSize: 20,
        status: 3
      }
    };
  },
  mounted() {
    this.getStoreList();
  },
  methods: {
    async getStoreList() {
      this.loading = true;
      const res = await getStoreList(this.query);
      this.loading = false;
      console.log(res);
      this.pagination.total = res.data.over_count;
      this.list = res.data.list;
    }
  }
};
</script>

<style lang="less" scoped>
.new-company {
  background: @white;

  .table-wrapper {
    margin: 0 auto 16px;

    .table-title {
      font-weight: bold;
      font-size: 18px;
      padding: 16px 0 16px 20px;
    }
  }

  /deep/.ant-table table {
    border-radius: 0;
    cursor: pointer;
  }
}
</style>
